<PageHeader as |p|>
  <p.top>
    <KmipBreadcrumb @scope={{@scope}} />
  </p.top>
  <p.levelLeft>
    <h1 class="title is-3">
      {{@role}}
    </h1>
  </p.levelLeft>
</PageHeader>
<div class="tabs-container box is-sideless is-fullwidth is-paddingless is-marginless">
  <nav class="tabs">
    <ul>
      {{#link-to "credentials.index" @scope @role tagName="li"}}
        {{#link-to "credentials.index" @scope @role data-test-kmip-link-credentials="true"}}
          Credentials
        {{/link-to}}
      {{/link-to}}
      {{#link-to "role" @scope @role tagName="li"}}
        {{#link-to "role" @scope @role data-test-kmip-link-role-details="true"}}
          Details
        {{/link-to}}
      {{/link-to}}
    </ul>
  </nav>
</div>
